<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>提现</title>
    <!-- 基本框架 -->
    <link rel="stylesheet" href="../../../css/common.css">
    <script src="../../../script/vue.min.js" type="text/javascript"></script>
    <script src="../../../script/frame.js" type="text/javascript"></script>
    <script src="../../../script/baseConfig.js" type="text/javascript"></script>
    <script src="../../../script/utils.js" type="text/javascript"></script>
    <script src="../../../script/common.js" type="text/javascript"></script>
    <style>
          body{background:#FFF;}
          #container{
              padding:0 0.46rem;
              padding-top:0.2rem;
          }
          .sureMoney{
            background:linear-gradient(to right,#ff2626 0%,#fd6e1f 70%);
            color:#FFF;
            width:100%;
            display: block;
            height:1rem;
            line-height:1rem;
            text-align:center;
            font-size:0.31rem;
            border-radius:3rem;
            margin-top:0.85rem;
          }
          .cash{
            margin-top:0.1rem;
          }
          .cash h3{
            color:#616161;
            height:0.7rem;
            line-height:0.7rem;
            font-weight:normal;
          }
          .cash .inputMoney{
            position:relative;
            margin-top:0.1rem;
            border-bottom:1px solid #F6F6F6;
          }
          .cash .inputMoney span{
            color:#2F2F2F;
            position:absolute;
            left:0;
            top:0;
            height:1.3rem;
            width:0.6rem;
            line-height:1.34rem;
            font-size:0.5rem;
            font-weight:normal;
          }
          .cash .inputMoney input{
            margin:0;
            padding:0.4rem 0;
            padding-left:0.65rem;
            line-height:0.5rem;
            display:block;
            width:100%;
            font-size:0.6rem;
            color:#2F2F2F;
            height:1.3rem;
          }
          .cash_notice{
            color:#A2A2A2;
            line-height:0.5rem;
            font-size:0.28rem;
            margin:0.5rem 0;
            font-weight:300;
            padding:0 0.3rem;
          }
          .alipay{
            background:#F7F7F7;
            color:#B1B1B1;
            padding:0.21rem 0.2rem;
            font-size:0.28rem;
            border-radius:0.06rem;
            margin-bottom:0.6rem;
            text-align:center;
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
          }
          .alipay.bind{
            text-align:left;
            padding:0.21rem 0.35rem;
            padding-right:1rem;
            line-height:0.5rem;
            position:relative;
            width: 100%;
          }
          .alipay.bind img{
            height:0.5rem;
            width:0.5rem;
            margin-right:0.2rem;
            vertical-align: middle;
          }
          .alipay.bind font{
            position:absolute;
            right:0.35rem;
            top:0.21rem;
            height:0.5rem;
            line-height:0.5rem;
          }
          input::-webkit-input-placeholder {
            font-size: 16px;
          }
    </style>
</head>
<body>
    <div id="app" v-cloak>
        <template v-if="info != null">
            <div id="container">
                <div class="cash">
                    <div class="alipay" v-if="info.alipay_name == null">
                        请先绑定支付宝后再提现，前去<font @click="$.openUrl('common/commonTitle','common/changeAlipay',{title:'绑定支付宝', referer: 'wallet'});" color="#79CBFF">绑定</font>
                    </div>
                    <div class="alipay bind" v-else>
                        <img src="../../../image/my/alipay.png" />
                        {{info.alipay_name}} - {{info.alipay_id}}
                        <font v-if="info.alipay_change.is_able_changed_alipay == 1"  @click="$.openUrl('common/commonTitle','common/changeAlipay',{title:'绑定支付宝', referer: 'wallet'});" color="#79CBFF">修改</font>
                    </div>
                    <h3>提现金额</h3>
                    <div class="inputMoney">
                        <span>￥</span>
                        <input type="number" v-model.trim="money" />
                    </div>
                    <button @click="onWidthdraw" class="sureMoney">立即提现</button>
                    <div class="cash_notice">
                        提现说明：<br />
                        每日可提现{{info.cashCount}}次，每次最低{{$.parsePrice(info.minCash, 2)}}元，提现手续费{{info.cashService}}%
                    </div>
                </div>
            </div>
        </template>
        <template v-else>
            <div class="loadFull whiteBg">
                <div class="se-loading"></div>
            </div>
        </template>
    </div>
    <script type="text/javascript">
        apiready = function() {
            var app = new Vue({
                el:'#app',
                data:{
					iosTest:false,
                    info: null,
                    money: ''
                },
                methods:{
                    getAlipayInfo: function(){
                        var _this = this;
                        $.ajax({
                            url: '/cash/drawn/',
                            method: 'get',
                            success: function(res){
                                _this.info = res.data;
                            },
                            error: function(err){
                                $.toast(err.message);
                            }
                        });
                    },
                    validate: function(){
                        var money = this.money;
                        var minCash = this.info.minCash;
                        if(this.info.alipay_name == null){
                            $.toast('请先绑定支付宝再操作');
                            return false;
                        }
                        if(money == ''){
                            $.toast('请输入提现金额');
                            return false;
                        }
                        if($.yuanToSys(money) < minCash){
                            $.toast('提现金额不能低于'+$.parsePrice(minCash, 2));
                            return false;
                        }
                        return true;
                    },
                    onWidthdraw: function(){
                        var money = $.yuanToSys(this.money);
                        var _this = this;
                        if(!this.validate()){
                            return false;
                        }
                        $.ajax({
                            url: '/cash/drawn/',
                            method: 'post',
							load:true,
                            data: {money: money},
                            success: function(res){
                                $.alert('提现成功', function(){
                                    api.sendEvent({
                                        name: 'updateWalletPage',
                                    });
                                    api.sendEvent({name: 'updateMyIndexPage'});
                                    api.closeWin();
                                });
                            },
                            error: function(err){
                                $.toast(err.message);
                            }
                        });
                    },
                },
                mounted(){
					$.initJs(this);
                    this.getAlipayInfo();
                }
            });

            api.addEventListener({name: 'updateWidthDrawPage'}, function(ret, err){
                app.getAlipayInfo();
            });
        }
    </script>
</body>
</html>
